<template>
  <span
    :class="{
      'text-danger': +num < 0,
      'text-success': +num > 0,
      'text-black': noColor
    }"
  >
    <template v-if="!locale">
      {{ parseFloat(String(currency(+num))) }}
    </template>
    <template v-else>
      {{ Number(String(currency(+num))).toLocaleString("zh-CN") }}
    </template>
  </span>
</template>
<script setup lang="ts">
import currency from "currency.js";

withDefaults(
  defineProps<{
    locale?: boolean;
    noColor?: boolean;
    num: number | string;
  }>(),
  {
    locale: undefined,
    noColor: undefined,
    num: 0
  }
);
</script>
